import React, { Component } from 'react'
import { Form, Input, Button } from 'antd';
// import UploadPicture from '../../components/UploadPicture';
// import MyUpload from "../../components/MyUpload/index"
export default class AvailableChangeForm extends Component {

    onFinish = (values) => {
        console.log("收到数据如下");
        fetch('http://127.0.0.1:8000/Form', {
            // fetch('http://127.0.0.1:8000/JSON-server', {
            method: 'post',
            headers: {
                "Content-type": "application/json"
            },
            body: JSON.stringify(values)
        }).then((response) => {
            return response.json()
        }).then((data) => {
            console.log(data)
        }).catch(function (error) {
            console.log(error)
        })
    };

    onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
    };

    render() {

        // const {
        //     areaname,
        //     acreage,
        //     landform,
        //     target,
        //     direaction,
        //     phone,
        //     abstract
        // } = this.props.location.state.item

        return (
            <div style={{ marginTop: 40 }}>
                <Form
                    name="basic"
                    labelCol={{
                        span: 3,
                    }}
                    wrapperCol={{
                        span: 7,
                    }}
                    // defaultValues={{
                    //     remember: true,
                    // }}

                    onFinish={this.onFinish}
                    onFinishFailed={this.onFinishFailed}
                    autoComplete="off"
                >
                    <Form.Item
                        label="村域名称"
                        name="areaname"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your areaname!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="整体面积"
                        name="acreage"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your landform!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="地形"
                        name="landform"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your landform!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="建设用地指标"
                        name="target"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your target!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="项目方向"
                        name="direaction"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your direction!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="联系电话"
                        name="phone"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your phone!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="介绍"
                        name="abstract"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your abstrace!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        wrapperCol={{
                            offset: 4,
                            span: 16,
                        }}
                    >
                        <Button type="primary" htmlType="submit">
                            提交
                        </Button>
                    </Form.Item>
                </Form>
                );
            </div >
        )
    }
}
